 <template>
 <el-dialog v-model="visible" title="Shipping address" :before-close="()=>close()">
    <el-form :model="form">
       <el-form-item label="账号" :label-width="formLabelWidth">
        <el-input v-model="form.username" autocomplete="off" />
      </el-form-item>
      <el-form-item label="姓名" :label-width="formLabelWidth">
        <el-input v-model="form.nickName" autocomplete="off" />
      </el-form-item>
      <el-form-item label="邮箱" :label-width="formLabelWidth">
        <el-input v-model="form.email" autocomplete="off" />
      </el-form-item>
      <el-form-item label="密码" :label-width="formLabelWidth">
        <el-input v-model="form.password" autocomplete="off" />
      </el-form-item>
      <el-form-item label="备注" :label-width="formLabelWidth">
        <el-input v-model="form.note" type="textarea" />
      </el-form-item>
      <el-form-item label="是否启用">
        <el-radio-group v-model="form.status" class="ml-4">
          <el-radio :label="1" size="large">是</el-radio>
          <el-radio :label="0" size="large">否</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="close()">取消</el-button>
        <el-button type="primary" @click="sumbit"
          >确定</el-button
        >
      </span>
    </template>
  </el-dialog>
 </template>
 
 <script lang='ts' setup>
import { ElMessage } from 'element-plus';
import { reactive, ref, watch } from 'vue'
import { umsAdmin } from '../../../request/http';
const props = withDefaults(
    defineProps<{
        visible: boolean; 
        formData:AdminResDataObj
    }>(), {
        visible: false,
        formData:()=>({} as AdminResDataObj)
    }
 )

const emit = defineEmits<{
    (event: "close",r?:'reload'): void;
}>()


const form = ref({} as AdminResDataObj);

watch(
    () => props.formData,
    (val) => {
        form.value = { ...val };
    }
)
const formLabelWidth = ref('180px');

// 确定按钮
async function sumbit() {
  let res;
  let msg;
  if (form.value.id) {
    res = await umsAdmin.updateAdmin(form.value.id,form.value);
    msg='修改用户信息成功'
  } else {
    res = await umsAdmin.registerAdmin(form.value)
     msg='添加用户信息成功'
  }
  if (res.code === 200) {
    // 关闭弹窗和更新数据表格
    close("reload");
      // 提示
      ElMessage({
          message: msg,
          type:'success'
      })
    }
}


function close(r?: 'reload') {
  // 关闭弹窗
    emit('close',r)
}
</script>

<style lang='less' scoped>
</style>